import React, { memo, Suspense } from 'react'
import { BrowserRouter as Router,useRoutes} from 'react-router-dom'
import { Provider } from 'react-redux'
import routesArr from './router'
import store from './store'
import AppHeader from './components/app-header'
import AppFooter from './components/app-footer'
import Player from './pages/player/c-cpns/play-bar-panel'
import { BackTop } from 'antd'



const App = () => {
  const routes = useRoutes(routesArr)
  return routes
}


export default memo(function AppWrapper() {
 
  
  return (
    <Provider store={store}>
    
    <Router>
      <AppHeader/>
      <Suspense fallback={<h2>isLoading</h2>}>
          <App />
        </Suspense>
        <Player/>
        
        <AppFooter />
        <BackTop/>
    </Router>
    </Provider>
  )
})
